<template>
  <div class="basicwarp">
    <div class="basic-md" @click="goPersonList">
      <div class="md-name">从业人员</div>
      <div class="md-info">{{ perList }}</div>
    </div>
    <div class="basic-md" @click="goToHistory">
      <div class="md-name">历史订单</div>
      <div class="md-info">{{ hisCount }}</div>
    </div>
  </div>
</template>

<script>
import store from "@/store/store";

export default {
  name: "BasicInfo",
  props: ["text"],
  data() {
    return {
      hisCount: 0,
      perList: 0
    };
  },
  computed: {
    companyId() {
      return store.state.companyId;
    }
  },
  methods: {
    goPersonList() {
      const url = "/pages/personList/index";
      this.mpvue.navigateTo({ url });
    },
    goToHistory() {
      const url = "/pages/historyDd/index";
      this.mpvue.navigateTo({ url });
    },
    getHisCount() {
      const url = store.state.server + "/auth/getHistoryDdCount";
      this.mpvue.request({
        url: url,
        methods: "post",
        data: {
          wyid: this.companyId
        },
        success: res => {
          this.hisCount = res.data;
        },
        fail: error => {
          uni.alert({
            content: error.errorMessage
          });
        }
      });
    },
    getPerCount() {
      const url = store.state.server + "/auth/getMemberListcount";
      this.mpvue.request({
        url: url,
        methods: "post",
        data: {
          wyid: this.companyId
        },
        success: res => {
          this.perList = res.data;
        },
        fail: error => {
          uni.alert({
            content: error.errorMessage
          });
        }
      });
    }
  },
  created() {
    this.getPerCount();
    this.getHisCount();
  }
};
</script>

<style scoped lang="scss">
@import "../common/common";

.basicwarp {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: $contentTopBackgroundColor;
  padding: 15px 5px;

  .basic-md {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #ffffff;
    cursor: pointer;

    .md-name {
      margin-bottom: 10px;
      opacity: 0.7;
      font-size: 14px;
      color: #f0f7ff;
    }

    .md-info {
      word-break: break-all;
      font-size: 16px;
      color: #fff;
    }
  }

  .basic-md:last-child {
    padding-right: 0;
  }
}
</style>
